<template>
	<view style="background-color: #f8f8f8;">
		<u-list @scrolltolower="scrolltolower">
			<u-list-item v-for="(item, index) in indexList" :key="index">

				<view style="margin-top: 20rpx;" class="itemView"
					@click="itemClick(item.id,item.proTitle,item.proContent)">
					<u-col>

						<view style="display: flex; flex-direction: row;">
							<u--image customStyle="margin: 20rpx 0rpx 0rpx 20rpx" :showLoading="true"
								:src="item.proPicture" width="200rpx" height="200rpx"></u--image>

							<view style="display: flex; flex-direction: column; width: 100vw;">
								
								<view style="display: flex; flex-direction: row;">
									<u-button
										style="display: inline; float: right; width: 100rpx; height: 45rpx;"
										type="primary" size="mini" :text="getRecordTypeName(item.recordType)" color="#D81E06"
										customStyle="margin: 30rpx 20rpx 0rpx 220rpx"></u-button>
									<u--text :bold="true" color="#111111" customStyle="margin: 20rpx 0rpx 0rpx 20rpx"
										:text="item.proTitle"></u--text>
								</view>
								


								<view>
									<u-row>
										<u-col span="6">
											<u-button style="width: 100rpx; height: 45rpx;" type="primary" size="mini"
												text="进行中" color="#69A4D6"
												customStyle="margin: 30rpx 0rpx 0rpx 220rpx"></u-button>
										</u-col>
										<u-col span="6">
											<view>
												<u--text color="red" style="display: inline; float: right;"
													:text="'￥:'+item.proMoney"
													customStyle="margin: 30rpx 10px 0px 5px"></u--text>
											</view>

										</u-col>

									</u-row>

									<u-row>
										<u-col span="8">
											<view style="display: flex; flex-direction: row;">
												<u-button style="width: 150rpx; height: 45rpx;" type="primary"
													size="mini" text="试玩充场" color="#69A4D6"
													customStyle="margin: 30rpx 0rpx 0rpx 220rpx"></u-button>
												<u-button style=" width: 100rpx; height: 45rpx;" type="primary"
													size="mini" text="主推" color="#E58147"
													customStyle="margin: 30rpx 0rpx 0rpx 30rpx"></u-button>
											</view>
										</u-col>


										<u-col span="4">
											<view>
												<u-button
													style="display: inline; float: right; width: 100rpx; height: 45rpx;"
													type="primary" size="mini" text="赏金" color="#D81E06"
													customStyle="margin: 30rpx 20rpx 0rpx 0rpx"></u-button>
											</view>

										</u-col>

									</u-row>
								</view>



							</view>
						</view>
					</u-col>
				</view>
			</u-list-item>
		</u-list>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				indexList: [],
			}
		},
		methods: {
			getRecordTypeName(type) {
				if (type == 1) {
					return '已接单'
				} else if (type == 2) {
					return '待审核'
				}else if (type == 3) {
					return '审核成功'
				}else if (type == 4) {
					return '审核失败'
				}
			},
			itemClick(id, title, proContent) {

			},
			getOrderList(recordType) {
				let param = {
					recordType: recordType,
					pageNum: 1,
					pageSize: 1000,
				}
				uni.showLoading({
					title: '请求中...'
				})
				this.$u.api.apiGetProjectRecordList(param).then(res => {
					console.log('apiGetProjectRecordList', res);
					uni.hideLoading();
					if (res.code == 1) {
						this.indexList = res.data.list
					} else {
						uni.$u.toast(res.msg);
					}
				})
			},
		},
		onLoad(options) {
			this.getOrderList(options.recordType)
		}
	}
</script>

<style>
	.itemView {
		display: flex;
		flex-direction: column;
		height: 240rpx;
		margin-left: 20rpx;
		margin-right: 20rpx;
		margin-bottom: 20rpx;
		background-color: white;
	}
</style>